<template>
    <div>
      <ul>
        <li  v-for="(item,index) in arr " :key="index">
        {{item}}
      </li>
        <button @click="fn">走一走</button>
      </ul>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        arr: ["篮球", "健身", "代码"],
      };
    },
    methods: {
  fn(){
    // 我点击一下就把头部的增加到最后面 
    this.arr.push(this.arr[0])
    // 在删除数组的第一项
    this.arr.shift();
  }
  
    },
  };
  </script>
  
  <style>
  </style>